<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>爱买购物网</title>
    <script src="js/jquery-3.7.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="js/bootstrap.bundle.js"></script>
    <link rel="stylesheet" href="indexcss/usercenter.css">
    <link rel="stylesheet" href="indexcss/usercenterbase.css">

</head>
<body>
    <div class="container">
        <header>
    <!-- 导航栏 -->
    <nav class="navbar navbar-light navbar-expand-md bg-light heima_nav">
        <div class="container-lg">
            <div class="row justify-content-between" style="width: 100%;">
                <div style="display: flex;">
                <a class="navbar-brand col-2" href="index.html">
                    <svg xmlns="http://www.w3.org/2000/svg" width="50" height="45" fill="currentColor" class="bi bi-arrow-left" viewBox="0 0 16 16">
                        <path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z"/>
                      </svg>
                </a>
                <button class="navbar-toggler align-items-end" style="width: 40px; height: 40px; margin-top: 10px; border: 1px solid black;" type="button" data-toggle="collapse" data-target="#navbarContent">
                    <span class="navbar-toggler-icon"></span>
                </button>
                
            </div>
                  
                <div class="row justify-content-start" style="margin-right: -40px;">
                    

                    <div class="navbar-nav1 user-info col-2">
                        <div class="nav-item">
                            <div class="dropdown show">
                                <a class="nav-link1 dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <img src="img/touxiang.png" alt="" class="user-img">
                                <span class="caret">用户88888881</span>
                                </a>
                            
                                <div class="dropdown-menu " aria-labelledby="dropdownMenuLink">
                                    <a class="dropdown-item" href="gwc.html">购物车</a>
                                    <a class="dropdown-item" href="usercenter.html">个人中心</a>
                                <a class="dropdown-item" href="#">退出登录</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            <div class="navbar-nav2 col-2 user-info" style="margin-right: 30px;">
                <div class="nav-item">
                    <div class="dropdown show">
                        <a class="nav-link1 dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                          <img src="img/touxiang.png" alt="" class="user-img">
                          <span class="caret">用户88888882</span>
                        </a>
                      
                        <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                            <a class="dropdown-item" href="gwc.html">购物车</a>
                            <a class="dropdown-item" href="usercenter.html">个人中心</a>
                          <a class="dropdown-item" href="#">退出登录</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> 
    </nav>
 </header>

    <div class="container">
        <div class="row">
        <aside class="aside col-12 col-sm-2 col-md-2 col-lg-2 col-xl-2 ">
          <div class="sidebar">
                <ul class="nav nav-tabs align-self-start">
                    <li class="nav-item user-aside">
                        <a class="nav-link active" data-toggle="tab" href="#option1">个人信息</a>
                    </li>
                    <li class="nav-item user-aside">
                        <a class="nav-link" data-toggle="tab" href="#option2">地址管理</a>
                    </li>
                    <li class="nav-item user-aside">
                        <a class="nav-link" data-toggle="tab" href="#option3">我的订单</a>
                    </li>
                    <li class="nav-item user-aside">
                        <a class="nav-link" data-toggle="tab" href="#option4">我的收藏</a>
                    </li>
                </ul>
          </div>
          <div class="collapse navbar-collapse col-7 head-text sidebar1" id="navbarContent">
            <ul class="nav nav-tabs align-self-start">
                <li class="nav-item user-aside">
                    <a class="nav-link active" data-toggle="tab" href="#option1">个人信息</a>
                </li>
                <li class="nav-item user-aside">
                    <a class="nav-link" data-toggle="tab" href="#option2">地址管理</a>
                </li>
                <li class="nav-item user-aside">
                    <a class="nav-link" data-toggle="tab" href="#option3">我的订单</a>
                </li>
                <li class="nav-item user-aside">
                    <a class="nav-link" data-toggle="tab" href="#option4">我的收藏</a>
                </li>
            </ul>
        </div>      
    </aside>
    <div style="float: right;" class="col-12 col-sm-10 col-md-10 col-lg-10 col-xl-10">
        <div class="content" style="margin-top: 20px;">
            <main>
                <div class="tab-content">
                    <!-- 个人信息 -->
                    <div id="option1"  class="container tab-pane active">
                        <div class="c1"><span class="star">*</span>姓名：</div>
						<div class="c2">
						    <input class="txt" type="hidden" name="_fmm.me._0.r" vid="rname" value=""/>
                            <p class="editline fd-hide">
                                <input class="txt" type="text" placeholder="8888888">
                            </p>
					    </div>
                        <div  class="fieldline fd-clr ">
                            <br>
                            <div class="c1 cradio"><span class="star">*</span>性别：</div>
                            <div class="c2">
                                <input type="radio" class="radio" name="_fmm.me._0.s" id="male" value="male"  checked="true"  >
                                <label for="male">先生</label>
                                <input type="radio" class="radio" name="_fmm.me._0.s" id="female" value="female" >
                                <label for="female">女士</label>
                            </div>
                        </div>
                        <br>
                        <div class="fieldline fd-clr ">
                            <div class="c1"><span class="star"></span>邮箱：</div>
                            <div class="c2 contactc2">
                                <p class="editline fd-hide">
                                    <input class="txt noime" type="text" name="_fmm.me._0.m" vid="mail"/>
                                </p>
                            </div>
                        </div>
                        <br>
                        <div class="fieldline fd-clr  ">
                            <div class="c1">手机：</div>
                            <div class="c2">
                                <p class="editline  fd-hide">
                                    <input class="txt noime" type="text" vid="cellphone"/>
                                <br/>
                                </p>
                                
                            </div>
                        </div>
                        <br>
                        <div id="mem-add" class="fieldline fd-clr " >
                            <div class="c1 cradio">
                                    <span class="star">*</span>联系地址：
                            </div>
                            <div class="c2">
                                <div id="mem-dq" class="fd-left fd-hide">
                                    <div class="combobox"></div>
                                    <div class="combobox"></div>
                                    <div class="combobox"></div>	
                                    <input type="hidden" id="meminp-dq-hid" name="_fmm.me._0.a" value="" />
                                </div>
                                <div id="mem-indq" class="fd-left fd-hide">
                                        <input type="text" class="input-text" id="in-province" placeholder="省级地区" name="_fmm.me._0.pr" value="" valid="{lazy:false,cache:false,type:'fun',fun:Profile.basic.vMethod.vForein,key:'省级地区'}" vg="1" vid="area1"/>
                                        <input type="text" class="input-text" id="in-city" placeholder="城市" name="_fmm.me._0.ci" value="" valid="{lazy:false,cache:false,type:'fun',fun:Profile.basic.vMethod.vForein,key:'城市'}" vg="1" vid="area2"/>
                                                      
                                </div>
                                <div class="c2" style="width: 250px; margin-top: 10px;"><input class="txt" type="text"placeholder="街道 门牌号 大厦名称 房间号码" style="width: 100%;"/></div>
                            </div>
                        </div>
                        <br>
                        <div class="fd-clr">
                            <div class="c1 cradio">爱买帐号：<span class="defkey">88888888</span></div>
                        </div>
                        <div class="fd-clr" style="width:80%;margin:auto 100px auto 80px;color:#666;line-height:25px;">
                            <input type="checkbox" id="shengming">
                                我声明，此页面所填写内容均真实有效，特别是经营地址为店铺最新可联系到的地址，同时可以作为行政机关和司法机关送达法律文件的地址。如果上述地址信息有误，愿意承担由此带来的平台处罚（处理细则）、行政监管和司法诉讼风险。
                                <div class="error" id="shengmingError" style="display:none;">请勾选声明</div>
                        </div>
                        <button type="button" class="btn btn-primary">保存</button>
                      
                    </div>
                    <!-- 这个是地址管理 -->
                    <div id="option2" class="container tab-pane fade">
                        <div style="display: flex;">
                            <h6>已保存的收货地址:</h6>
                            <div style="margin-left: 20px; margin-top: -10px;">
                                <button type="button" class="btn btn-primary">新增收货地址</button>
                                <button type="button" class="btn btn-danger">导入收货地址</button>
                            </div>
                        </div>
                        <table class="table table-striped" style="margin-top: 30px;">
                            <thead>
                              <tr>
                                <th scope="col"><input type="checkbox" value="on"/></th>
                                <th scope="col">收货人</th>
                                <th scope="col">所在地区</th>
                                <th scope="col">详细地址</th>
                                <th scope="col">电话/手机</th>
                                <th scope="col">操作</th>
                              </tr>
                            </thead>
                            <tbody>
                              <tr>
                                <th scope="row"><input type="checkbox" value="on"/></th>
                                <td>Mark</td>
                                <td>东莞</td>
                                <td>广东创新科技职业学院菜鸟驿站</td>
                                <td>123456789</td>
                                <td>
                                    <button type="button" class="btn btn-primary">修改</button>
                                    <button type="button" class="btn btn-danger">删除</button>
                                </td>
                              </tr>
                              <tr>
                                <th scope="row"><input type="checkbox" value="on"/></th>
                                <td>Jacob</td>
                                <td>广州</td>
                                <td>广州市天河区猎德村菜鸟驿站</td>
                                <td>123456789</td>
                                <td>
                                    <button type="button" class="btn btn-primary">修改</button>
                                    <button type="button" class="btn btn-danger">删除</button>
                                </td>
                              </tr>
                              <tr>
                                <th scope="row"><input type="checkbox" value="on"/></th>
                                <td>Larry</td>
                                <td>上海</td>
                                <td>上海浦东机场T3客服柜台</td>
                                <td>123456789</td>
                                <td>
                                    <button type="button" class="btn btn-primary">修改</button>
                                    <button type="button" class="btn btn-danger">删除</button>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                    </div>
                    
                    <!-- 这个是订单管理 -->
                    <div id="option3"  class="container tab-pane fade">
                        
                        <div class="container">
                                <div class="row cart-thead">
                                    <div class="col-xl-1 col-lg-2 col-1 t-checkbox">
                                        <input type="checkbox" name="" id="" class="checkall">
                                    </div>
                                    <div class="col-xl-3 col-lg-3 col-3">商品</div>
                                    <div class="col-xl-2 col-lg-2 col-2">单价</div>
                                    <div class="col-xl-3 col-lg-2 col-2">数量</div>
                                    <div class="col-xl-2 col-lg-2 col-2">小计</div>
                                </div>
                                
                                <div class="row cart-item ">
                                    <div class="col-xl-1 col-lg-2 col-1 p-checkbox">
                                        <input type="checkbox" name="" id="" class="j-checkbox">
                                    </div>
                                    <div class="col-xl-3 col-lg-3 col-3 p-goods">
                                        <div class="p-img">
                                            <img src="shop/p1.jpg" alt="" />
                                        </div>
                                        <div class="p-txt">
                                            经典儿童文学...
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-price">¥ 32.50</div>
                                    <div class="col-xl-3 col-lg-2 col-2 p-num">
                                        <div class="quantity-form">
                                             2
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-sum">¥ 32.50</div>
                                </div>
                                
                                <div class="row cart-item">
                                    <div class="col-xl-1 col-lg-2 col-1 p-checkbox">
                                        <input type="checkbox" name="" id="" class="j-checkbox">
                                    </div>
                                    <div class="col-xl-3 col-lg-3 col-3">
                                        <div class="p-img">
                                            <img src="shop/p2.jpg" alt="" />
                                        </div>
                                        <div class="p-txt">
                                            经典儿童文学...
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-price">¥ 41.30</div>
                                    <div class="col-xl-3 col-lg-2 col-2 p-num">
                                        <div class="quantity-form">
                                            2
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-sum">¥ 41.30</div>
                                </div>
                                
                                <div class="row cart-item">
                                    <div class="col-xl-1 col-lg-2 col-1 p-checkbox">
                                        <input type="checkbox" name="" id="" class="j-checkbox">
                                    </div>
                                    <div class="col-xl-3 col-lg-3 col-3">
                                        <div class="p-img">
                                            <img src="shop/p3.jpg" alt="" />
                                        </div>
                                        <div class="p-txt">
                                            经典儿童文学...
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-price">￥12.60</div>
                                    <div class="col-xl-3 col-lg-2 col-2 p-num">
                                        <div class="quantity-form">
                                             2
                                        </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-2 col-2 p-sum">￥12.60</div>

                                </div>
                                
                                <div class="row cart-floatbar" style="justify-content: space-around;flex-wrap: wrap;">
                                    <div class="col-xl-1 col-md-5 col-sm-3 col-1 select-all">
                                        <input type="checkbox" name="" id="" class="checkall">全选
                                    </div>
                                    <div class="col-xl-5 col-12 toolbar-right">
                                            <button type="button" class="btn btn-danger">删除订单</button>
                                    </div>
                                </div>
                        </div>
                    </div>
                    <!-- 这个我的收藏 -->
                    <div id="option4" class="container tab-pane fade">
                        <div class="row row-cols-1 row-cols-sm-2 row-cols-md-4">
                    
                            <div class="card text-center mb-3">
                                <a href="HuanYouZhongGuo.html">
                                    <img src="./images/HuanYouZhongGuo.jpg" class="card-img-top" alt="...">
                                </a>
                                    <div class="card-body">
                                      <h5 class="card-title">《环游中国》</h5>
                                      <p class="card-text"><a href="javascript:;">地质出版社</a> 编 <a href="javascript:;">羽奕</a> 著</p>
                                      <a href="HuanYouZhongGuo.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                            
                                
                                <div class="card text-center mb-3">
                                    <a href="ChenYu.html">
                                        <img src="./images/ChengYu.jpg" class="card-img-top" alt="...">
                                    </a>
                                    <div class="card-body">
                                      <h5 class="card-title">《一口气读完成语故事》</h5>
                                      <p class="card-text"><a href="javascript:;">北京时代华文书局</a> 编 <a href="javascript:;">羽奕</a> 著</p>
                                      <a href="ChenYu.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="JiaShan.html"><img src="./images/JiaShan.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《家山》</h5>
                                      <p class="card-text"><a href="javascript:;">人民文学出版社</a> 编 <a href="javascript:;">王跃文</a> 著</p>
                                      <a href="JiaShan.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="LunYu.html"><img src="./images/LunYu.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《给孩子的四书五经》</h5>
                                      <p class="card-text"><a href="javascript:;">民主与建设出版社</a> 编 <a href="javascript:;">陈仁谦</a> 著</p>
                                      <a href="LunYu.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="QiangGuoJi.html"><img src="./images/QiangGuoJi.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《强国记》</h5>
                                      <p class="card-text"><a href="javascript:;">电子工业出版社有限公司</a> 编 <a href="javascript:;">徐</a> 著</p>
                                      <a href="QiangGuoJi.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="QingYuNian.html"><img src="./images/QingYuNian.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《庆余年》</h5>
                                      <p class="card-text"><a href="javascript:;">人民文学出版社</a> 编 <a href="javascript:;">猫腻</a> 著</p>
                                      <a href="QingYuNian.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="WuJiangYin.html"><img src="./images/WuJiangYin.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《乌江引》</h5>
                                      <p class="card-text"><a href="javascript:;">人民文学出版社</a> 编 <a href="javascript:;">庞贝</a> 著</p>
                                      <a href="WuJiangYin.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                <div class="card text-center mb-3">
                                    <a href="XiJinPin.html"><img src="./images/XiJinPin.jpg" class="card-img-top" alt="..."></a>
                                    <div class="card-body">
                                      <h5 class="card-title">《习近平引用诗词释读》</h5>
                                      <p class="card-text"><a href="javascript:;">人民文学出版社</a> 编 <a href="javascript:;">诗词编写组</a> 著</p>
                                      <a href="XiJinPin.html" class="btn btn-warning">立即购买</a>
                                    </div>
                                </div>
                                
                         </div>
                    </div>
                </div>
            </main>
          </div>
    </div>
</div>
    </div>
  </div>

</body>
</html>